// button core
@import "../../src/progress.less";

// theme variable
@import "variable.less";

// theme
@esui-progress-background: @esui-palette-neutral-color;
@esui-progress-bar-background: @esui-palette-primary-color;
@esui-progress-bar-font-color: @esui-palette-white;
@esui-progress-bar-font-size: 1em;
@esui-progress-bar-success-background: @esui-palette-success-color;
@esui-progress-bar-info-background: @esui-palette-info-color;
@esui-progress-bar-warning-background: @esui-palette-warning-color;
@esui-progress-bar-danger-background: @esui-palette-danger-color;
@esui-progress-bar-marker-background: @esui-palette-warning-color;

.esui-progress-theme() {
    .box-shadow(inset 0 1px 2px rgba(0,0,0,.1));
    background: @esui-progress-background;
}

.esui-progress-bar-theme() {
    color: @esui-progress-bar-font-color;
    background: @esui-progress-bar-background;
    .box-shadow(inset 0 -1px 0 rgba(0,0,0,.15));
    &.@{ui-class-prefix}-progress-bar-success {
        background: @esui-progress-bar-success-background;
    }
    &.@{ui-class-prefix}-progress-bar-info {
        background: @esui-progress-bar-info-background;
    }
    &.@{ui-class-prefix}-progress-bar-warning {
        background: @esui-progress-bar-warning-background;
    }
    &.@{ui-class-prefix}-progress-bar-danger {
        background: @esui-progress-bar-danger-background;
    }
    &.@{ui-class-prefix}-progress-bar-striped {
        .linear-gradient(
            -45deg,
            rgba(255, 255, 255, .15) 25%,
            transparent 25%,
            transparent 50%,
            rgba(255, 255, 255, .15) 50%,
            rgba(255, 255, 255, .15) 75%,
            transparent 75%,
            transparent
        );
        background-size: 40px 40px;
    }
    &.@{ui-class-prefix}-progress-bar-animated {
        .animation(esui-progress-bar-stripes 2s linear infinite);
    }
}

.esui-progress-marker-theme() {
    background: @esui-progress-bar-marker-background;
}

@-webkit-keyframes esui-progress-bar-stripes {
    0% {
        background-position: 0 0;
    }
    100% {
        background-position: 40px 0;
    }
}
@keyframes esui-progress-bar-stripes {
    0% {
        background-position: 0 0;
    }
    100% {
        background-position: 40px 0;
    }
}